<template>
  <div class="container">
    <homeheader></homeheader>
    <!-- <swiper ></swiper>
    <icons ></icons>
    <recommend ></recommend> -->
    <swiper :swipperlist = 'swiperlist'></swiper>
    <icons :iconslist = 'iconlist'></icons>
    <recommend :recommendlist = 'recommendlist'></recommend>
  </div>
</template>
<script>
    import homeheader from './components/header'
    import swiper from './components/swiper'
    import icons from './components/icons'
    import recommend from './components/recommend'
    import { mapState } from 'vuex'
    import axios from 'axios'
    export default {
        name: 'Home',
        data() {
            return {
                iconlist: [],
                recommendlist: [],
                swiperlist: [],
                weekendlist: [],
                lastCity: ''
            }
            
        },
        components: {
            homeheader,
            swiper,
            icons,
            recommend
        },
        computed: {
            ...mapState(['city'])
        },
        methods: {
            getHomeInfo () {
                axios.get('/api/index.json?city='+this.city)
                    .then(this.getHomeInfoSucc)
            },
            getHomeInfoSucc (res) {
                this.iconlist = res.data.data.iconList
                this.recommendlist = res.data.data.recommendList
                this.swiperlist = res.data.data.swipperList
                this.weekendlist = res.data.data.weekendList
                // console.log(this.iconlist);
                // console.log(this.recommendlist);
                // console.log(this.swiperlist);
                // console.log(this.weekendlist);
                // console.log(res);
            }
        },
        mounted () {
            this.lastCity = this.city
            this.getHomeInfo()
        },
        activated() {
            if(this.lastCity !== this.city ){
                this.lastCity = this.city
                this.getHomeInfo()
            }
        }
    }
</script>

<style lang="stylus" scoped></style>